/*
ProFolio vcard
Copyrights- istoredesigns.com - PremiumFreebies.eu
made by: Oussama Afellad

July - 2011
*/

@import "reset.css";

/*----------------------------------General Styles----------------------------------*/
body{font-size:11px;font-family:"Lucida Grande",Verdana,sans-serif;background:#000 url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/wrapper.jpg) center}
a{color:#6aa2c5}
p{padding:10px 15px 0 0;color:#777;text-shadow:1px 1px 1px #fff;line-height:16px}
p img{background:#eee; border:5px solid #e6e6e6; float:left;margin:0 10px 10px 0}
h1{color:#555;font-size:26px;font-weight:normal;text-shadow:1px 1px 1px #fff;margin-bottom:10px}
h2{color:#636363;font-size:19px;font-weight:normal;text-shadow:1px 1px 1px #fff;padding:0;margin-bottom:15px}
ul,ol{margin-top:10px}
ul li,ol li{padding:5px 0 5px 0;color:#777;text-shadow:1px 1px 1px #fff;list-style:square inside}
ol li{list-style-type:lower-alpha}
li span{display:block}
.li-moreinfo{padding:5px 0 5px 0;color:#777;text-shadow:1px 1px 1px #fff;list-style:none}
hr{height:2px;border:none;background:url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/hr.gif) repeat-x;margin:0 30px}
hr.spacer{clear:both;height:25px;background:none}
input{font-family:Arial;padding:8px 0 8px 5px;margin:0 0 10px 0;width:420px;background:#fff;border:1px solid #dbdbdb;color:#999;font-size:13px;display:block;-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px}
textarea{font-family:Arial;padding:8px 0 8px 5px;margin:0 0 10px 0;width:420px;background:#fff;border:1px solid #dbdbdb;color:#999;font-size:13px;display:block;height:45px;resize:none;-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px}
.clear{clear:both}
.clearpx{height:1px}
.spacer{height:15px}
.small{position:absolute;font-size:11px;color:#777;padding-top:4px}
.small a{color:#777;text-decoration:none}
.pagetitle{display:none}
.nopadding{padding:0}

/*----------------------------------Items----------------------------------*/
#wrapper{min-width:800px;min-height:500px}
#vcard{display:none;z-index:2;position:relative;margin:auto;width:800px;height:450px;background:url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/wrapper.png);-webkit-box-shadow:0 0 0px #000;-moz-box-shadow:0 0 0px #000;box-shadow:0 0 0px #000}
.main{float:right;width:480px;margin-right:20px;background:url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/sidebar.png) repeat-y;padding-left:40px}
.sidebar{float:left;margin:0px;width:170px;height:240px;}
.button{padding:6px 8px;border:1px solid #09a0ff;background:url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/button.gif) repeat-x;color:#fff;text-shadow:1px 1px 1px #1069a1;text-transform:uppercase;font-size:9px;font-weight:bold;text-decoration:none;-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px}
.button:hover{background-position-y:-24px;border-color:#1e8dff;text-shadow:1px 1px 1px #3284ff}

/*----------------------------------Header----------------------------------*/
#header{margin:30px 30px 0 30px;height:100px}
#header .profilepicture{float:left}
#header .profilepicture img{width:80px;height:80px}
#header #logo{float:left;text-indent:-9999px;background:url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/logo.png);margin:7px 0 0 20px;width:300px;height:80px}
#header ul#menu{float:right;height:45px;margin:14px 20px 0 0;padding:0 15px 0 0;-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px}
#header ul#menu li{float:left;padding:16px 0 0 15px;font-weight:bold;font-size:13px;text-transform:uppercase;color:#999;text-shadow:1px 1px 1px #fff;list-style:none}
#header ul#menu li a{color:#999;text-decoration:none}
#header ul#menu li a:hover{color:#555; border-bottom:2px solid #e3e3e3; border-margin:10px;}
#header ul#menu li.active a{color:#555;}

/*----------------------------------Content----------------------------------*/
#content{position:relative;margin:25px 30px 0 50px;height:240px;overflow:hidden}
#scroller{position:relative;height:240px}
#scroller .contentitem{width:710px;height:240px;float:left;display:none;margin-right:30px}

/*----------------------------------Skills----------------------------------*/
ul.skills{margin:10px 0 0 0}
ul.skills li{padding:15px 10px 14px 0;border-bottom:1px solid #ddd;color:#888;text-shadow:1px 1px 1px #fff;list-style:none}
ul.skills li:last-child{border-bottom:none}
ul.skills li .topic{float:left;width:160px;font-weight:bold;color:#777;font-size:14px;text-shadow:1px 1px 1px #fff;height:7px}
ul.skills li .stars{float:left;width:120px}

/*----------------------------------Work----------------------------------*/
#workmask{width:710px;height:185px;position:relative;margin-top:25px;overflow:hidden}
#workscroller{width:710px;position:absolute;margin-top:0}
.work-item-preview {display:block;background:url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/bg-fade.png) no-repeat center center;}
ul.work{margin-top:0}
ul.work a{color:#4d4d4d}
ul.work li{padding:0;position:relative;float:left;display:block;list-style:none;width:225px;height:85px;margin:0 15px 15px 0;background:url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/workbg.png);overflow:hidden}
ul.work li a{text-decoration:none}
ul.work li.last{margin:0 0 15px 0}
ul.work li .worktitle{font-family:Verdana;position:relative;margin:-55px 0 0 0;margin:0 0 0 0;padding:10px 7px 7px 7px;width:211px;height:14px;border-top:1px solid #ccc;border-bottom:1px solid #ccc;background:#dedede;font-weight:bold;font-size:13px;text-transform:uppercase;list-style:none}
ul.work li img{width:225px;height:85px;overflow:hidden}
ul.navigation{float:right;margin:5px 0 0 0}
ul.navigation li{float:left;margin-left:5px;padding:3px 5px 3px 6px;background:#ddd;color:#777;font-weight:bold;text-shadow:1px 1px 1px #fff;border-right:1px solid #fff;border-bottom:1px solid #fff;-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; list-style:none; cursor:pointer}
ul.navigation li.active{background:#ccc;color:#555;text-shadow:1px 1px 1px #eee;border:none;padding:3px 6px 4px 6px}
ul.navigation li:hover{background:#ccc;border:none;padding:3px 6px 4px 6px}

/*----------------------------------Networks----------------------------------*/
ul.networks li{float:left;width:224px;height:38px;padding:15px 25px 15px 0;list-style:none;cursor:pointer}
ul.networks .last{width:186px}
ul.networks li a{text-decoration:none}
ul.networks li .background{width:210px;height:42px;background:url(http://dl.dropbox.com/u/14422613/Portfolio%20Templete/networksbg.png);position:absolute;display:none}
ul.networks li .content{position:absolute;display:block;z-index:2;margin:6px 0 0 0}
ul.networks li img{float:left;padding-right:8px;width:32px;height:32px;border:0}
ul.networks li .title{float:left}
ul.networks li .title .sname{color:#555;font-size:15px;text-shadow:1px 1px 1px #fff;height:7px;font-weight:bold}
ul.networks li .title .surl{clear:both;color:#888;font-size:11px;margin:0;padding:0;text-shadow:1px 1px 1px #fff}
ul.networks li p{color:#999;font-size:11px;margin:0;padding:0}

/*----------------------------------Contact----------------------------------*/
.contact .sendbutton{float:right;width:auto;padding:4px 20px;background:#cfcfcf;color:#858585;text-shadow:1px 1px 1px #fff;border:none;text-transform:uppercase;font-weight:bold;font-size:10px;cursor:pointer}
.contact .error{background:#feeded;border-color:#fcd5d5}
#email_form{margin-top:25px;width:427px}
#email_send{margin-top:25px;width:427px;display:none}
